<template>
  <div>
    <div class="area-header">
      <span class="area-header-title">{{ $t('股权项目导入') }}</span>
    </div>

    <el-upload
      ref="upload"
      :limit="1"
      accept=".xlsx, .xls"
      :headers="upload.headers"
      :action="upload.url + '?updateSupport=' + upload.updateSupport"
      :disabled="upload.isUploading"
      :on-progress="handleFileUploadProgress"
      :on-success="handleFileSuccess"
      :auto-upload="false"
      drag
    >
      <i class="el-icon-upload" />
      <div class="el-upload__text">
        {{ $t('将文件拖到此处，或') }}
        <em>{{ $t('上传') }}</em>
      </div>
      <!--        <div slot="tip" class="el-upload__tip">-->
      <!--          <el-checkbox v-model="upload.updateSupport" /> {{ $t('是否更新已经存在的数据') }}-->
      <!--        </div>-->
      <div slot="tip" class="el-upload__tip" style="color:red">
        {{ $t('提示：仅允许导入“xls”或“xlsx”格式文件！') }}
      </div>
    </el-upload>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">{{ $t("取消") }}</el-button>
      <el-button type="primary" @click="submitFileForm">{{ $t("确定") }}</el-button>
    </div>
  </div>
</template>
<script>
import { getToken } from '@/utils/auth'
export default {
  data() {
    return {
      // 遮罩层
      loading: true,
      // 用户导入参数
      upload: {
        // 是否显示弹出层（用户导入）
        open: false,
        // 弹出层标题（用户导入）
        title: '',
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的用户数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Authorization: 'Bearer ' + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + '/deal/KaiHuiUploadDeal/importData'
      }
    }
  },
  methods: {
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = this.$t('导入')
      this.upload.open = true
    },
    // 取消按钮
    cancel() {
      this.$parent.$parent.formOpen = false
      this.upload.open = false
    },
    // 文件上传中处理
    handleFileUploadProgress() {
      this.upload.isUploading = true
    },
    // 文件上传成功处理
    handleFileSuccess(response) {
      this.upload.open = false
      this.upload.isUploading = false
      this.$refs.upload.clearFiles()
      this.$alert(response.msg, this.$t('导入结果'), { dangerouslyUseHTMLString: true })
      this.getList()
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit()
    }
  }
}
</script>
